<template>
    <div>
        <a-row align="center" :gutter="[0, 16]">
            <a-col :span="24">
                <a-card title="密码修改">
                    <a-form :model="form" :rules="rules" :style="{ width: '600px' }" @submit="onSubmit">
                        <a-form-item field="password" label="原密码" :rules="[{ required: true, message: '原密码不能为空' }]">
                            <a-input-password v-model="form.password" placeholder="请输入原密码" allow-clear />
                        </a-form-item>
                        <a-form-item field="newpassword" label="新密码" :rules="[{ required: true, message: '新密码不能为空' }]">
                            <a-input-password v-model="form.newpassword" placeholder="请输入新密码" allow-clear />
                        </a-form-item>
                        <a-form-item field="confirmPassword" label="确认新密码" validate-trigger="blur">
                            <a-input-password v-model="form.confirmPassword" placeholder="确认新密码" allow-clear />
                        </a-form-item>
                        <a-form-item>
                            <a-button type="primary" html-type="submit">提交</a-button>
                        </a-form-item>
                    </a-form>
                </a-card>
            </a-col>
        </a-row>
    </div>
</template>

<script setup lang="ts">
import { Message } from "@arco-design/web-vue";
import { updatepsdAPI } from "@/api/modules/user/index"
let userInfo2 = JSON.parse(localStorage.getItem("user-info") as string);
const form = ref(
    {
        password: "",
        newpassword: "",
        confirmPassword: "",
        user_key:userInfo2.account.user_key
    }
);

const rules = ref({
    confirmPassword: [
        {
            required: true,
            message: '新密码不能为空',
        },
        {
            validator: (value, cb) => {
                if (value !== form.value.newpassword) {
                    cb('两次密码输入不一致')
                } else {
                    cb()
                }
            }
        }
    ],
});
const onSubmit = async ({ values, errors }) => {
   

    if (errors) return;


    delete values.confirmPassword
    let res = await updatepsdAPI(values) as any;
    if (res.status == 2) {
        Message.success("修改成功")
    }else{
        Message.error(res.statusMsg)
    }

};
</script>

<style lang="scss" scoped>
.row-title {
    font-size: $font-size-title-1;
}
</style>